<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<!DOCTYPE html>
	<html lang="en" class="no-ie" style="overflow:hidden;">
		<head>
			<meta charset="UTF-8">
			<title>近7天进场分析</title>
			<script>
				"object" != typeof ue || "object" != typeof ue.interface ? ("object" != typeof ue && (ue = {}), ue.interface = {},
					ue.interface.broadcast = function(e, t) {
						if ("string" == typeof e) {
							var o = [e, ""];
							void 0 !== t && (o[1] = t);
							var n = encodeURIComponent(JSON.stringify(o));
							"object" == typeof history && "function" == typeof history.pushState ? (history.pushState({}, "",
								"#" + n), history.pushState({}, "", "#" + encodeURIComponent("[]"))) : (document.location
								.hash = n, document.location.hash = encodeURIComponent("[]"))
						}
					}) : function(e) {
					ue.interface = {}, ue.interface.broadcast = function(t, o) {
						"string" == typeof t && (void 0 !== o ? e.broadcast(t, JSON.stringify(o)) : e.broadcast(t, ""))
					}
				}(ue.interface), (ue4 = ue.interface.broadcast);
			</script>
			<script src="./dist/echarts.min.js"></script>
			<script src="./static/js/jquery.min.js"></script>
			<script src="./static/js/FuncTest.js"></script>
			<script src="./static/js/PortChart.js"></script>
			<script>
				$(function() {
					ue4("getSize", {
						mes: "get windows size"
					});
					ue4("getColor", {
						mes: "get all color"
					});
					ue4("getData", {
						mes: "get all data"
					});
					ue4("beginSize", {
						mes: BeginSize[0],
						mes2: BeginSize[1]
					});
					ue4("beginSizeY", {
						mes: BeginSize
					});
				});
				/*$(function () {
				    
				});*/
			</script>
			<style>
				* {
					margin: 0;
					padding: 0;
				}
				@font-face {
					font-family:DIN;
					src: url(./static/font/DIN-Medium.otf);
				}
			</style>
		</head>
		<body>
			<div id="main"></div>
			<!--
		dataTemp1: y轴数值;dataTemp2: x轴标题
		-->
			<script>
				let BeginSize = [418.48, 267.06];
				let myChart = null;
				let itemData=[265,318,717,1600]
				let itemTitle=['2018','2019','2020','2025']
				let dataList1 = []
				let colorList=["#46A8FF",'#24DCF7','#F5A787',"#F5BA25",'#FFFFFF',"rgba(35, 84, 128, 0.1)"]
				let colorList1=["#235480",'#735D38','#7B5444']
				itemData.forEach((item,index)=>{
					let labelColor=""
					let itemStyleColor=""
					let itemStyleColor1=""
					let labelfontSize
					if(index==itemData.length-1){
						labelColor=colorList[3]
						itemStyleColor=colorList[2]
						itemStyleColor1=colorList1[2]
						labelfontSize=19
					}else if(index==itemData.length-2){
						labelColor=colorList[1]
						itemStyleColor=colorList[1]
						itemStyleColor1=colorList1[0]
						labelfontSize=15
					}else{
						labelColor=colorList[4]
						itemStyleColor=colorList[0]
						itemStyleColor1=colorList1[0]
						labelfontSize=15
					}
					dataList1.push({
						name:itemTitle[index],
						value:item,
						label:{
							show:true,
							position:'top',
							fontSize:labelfontSize,
							color:labelColor,
							lineHeight:16,
							fontWeight: "bold"
						},
						itemStyle: {
							color: {
									type: "linear",
									x: 0,
									x2: 1,
									y: 0,
									y2: 0,
									colorStops: [
										{
										offset: 0,
										color: itemStyleColor,
										},
										{
										offset: 0.5,
										color: itemStyleColor,
										},
										{
										offset: 0.5,
										color: itemStyleColor1,
										},
										{
										offset: 1,
										color: itemStyleColor1,
										},
									],
							}
						},
					})
				})
				function fresh() {
					if (myChart==null) {
					    myChart = echarts.init(document.getElementById('main'));  //利用原型调取Echarts的初始化方法
					}
					let option = {
						backgroundColor: 'rgba(3, 16, 38, 0.71)',
						
						tooltip: {
							show: false,
						},
						legend: {
							show: false,
						},
						grid: {
							left: '8%',
							right: '8%',
							top: '25%',
							width: "84%",
							height:'65%',
							containLabel: true
						},
						xAxis: [{
							splitLine: {
								show: false
							},
							axisLine: {
								show: true,
								lineStyle:{
									type:'solid',
									color:'#B1B1B1',
									width:1
								}
							},
							axisTick :{
								show:false
							},
							axisLabel: {
								color: '#DFF8FF',
								fontSize: 17,
							},
							data: itemTitle,
							type: 'category',
							show: true,
						}],
						yAxis: [{
							splitLine: {
								show: true,
								lineStyle:{
									type:'dotted',
									color:'#556468',
									width:1
								}
							},
							axisLine: { //y轴
								show: true,
								lineStyle:{
									type:'solid',
									color:'#B1B1B1',
									width:1
								}
							},
							name:'单位：亿元',
							nameLocation: "end",
							nameTextStyle:{
								color:'#99C8FF',
								fontSize:15,
							},
							type: 'value',
							axisTick: {
								show: false
							},
							axisLabel: {
								color: 'rgba(255,255,255,0.6)',
								fontSize: 15,
								margin: 20
							},
							// max:9,
							// interval:3
						}],
						series: [
							{
								z: 1,
								name: '数据',
								type: "pictorialBar",
								symbol: "triangle",
								barWidth: 37,
								barGap: "0%",
								data: dataList1,
							},
							]

					};
					myChart.setOption(option);
				}
				fresh();


				//浏览器测试用
				change(BeginSize[0], BeginSize[1]);

				function change(x, y) {
					let div = document.getElementById("main");
					//alert("I am an alert box!!");
					div.style.width = x + "px";
					div.style.height = y + "px";
					var myOption = myChart.getOption();
					myChart.resize();
					let types = []
					myOption.series.forEach((item) => {
						types.push(item.type)
					})
					return types
				}


				/************下面数据***********/
				ue.interface.TransList = function(data) {
					itemData = data;
					fresh();
				};

				ue.interface.TransList1 = function(data) {
					itemTitle = data;
					fresh();
				};

			</script>
		</body>
	</html>

	<body>
	</body>
</html>
